import React from 'react'
import logo from './logo.svg'
import { useTranslation } from 'react-i18next'
import { Table } from 'antd'
import 'antd/dist/antd.css'
import './App.css'

function App() {
  const { t, i18n } = useTranslation(['app'])
  return (
    <div className="App">
      <div>
        <button
          onClick={() => {
            i18n.changeLanguage('zh')
          }}
        >
          中文
        </button>
        <button
          onClick={() => {
            i18n.changeLanguage('en')
          }}
        >
          english
        </button>
      </div>
      <h1>{t('helo')}</h1>
      <Table
        columns={[
          {
            title: t('index') as string,
            render(a: any, b: any, index: number) {
              return index + 1
            },
          },
          {
            title: t('name') as string,
            dataIndex: 'name',
          },
        ]}
        dataSource={[
          {
            name: '张三',
          },
          {
            name: '李四',
          },
        ]}
        pagination={{
          showSizeChanger: true,
        }}
      ></Table>
    </div>
  )
}

export default App
